<template>
  <div class="page-container">
    <!--面包屑导航-->
    <div class="breadcrumb">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item>会员中心</el-breadcrumb-item>
        <el-breadcrumb-item>会员等级管理</el-breadcrumb-item>
        <el-breadcrumb-item>查看商家店铺等级</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="tab-container">
      <el-tabs v-model="activeName" @tab-click="handleClick" type="card">
        <el-tab-pane label="基础设置" name="first">
          <el-form :inline="true" :model="baseFilters" :size="size" ref="baseFilters">
            <!--基础设置顶部搜索条件栏-->
            <el-row class="search-input">
              <!-- <el-form-item label="所属平台：">
                <el-select
                  v-model="baseFilters.childId"
                  clearable
                  placeholder="全部"
                  :disabled="childDis"
                >
                  <el-option
                    v-for="item in deptOption"
                    :key="item.businessId"
                    :label="item.deptName"
                    :value="item.businessId"
                  ></el-option>
                </el-select>
              </el-form-item> -->
              <el-form-item label="商家/店铺名称：">
                <el-input v-model="baseFilters.msName" clearable placeholder="商家/店铺名称" maxlength="80"></el-input>
              </el-form-item>
            </el-row>
            <!--基础设置顶部搜索条件按钮-->
            <div class="search-button-noborder">
              <el-form-item>
                <kt-button
                  icon="el-icon-search"
                  :label="'搜索'"
                  type="primary"
                  :size="size"
                  @click="findBasePage()"
                />
              </el-form-item>
              <el-form-item>
                <kt-button
                  :plain="true"
                  :label="$t('action.reset')"
                  type="primary"
                  @click="resetForm('baseFilters')"
                  :size="size"
                />
              </el-form-item>
            </div>
            <!--基础设置表格+分页器-->
            <div v-if="baseShow" class="w100">
              <!--表格-->
              <el-table
                :data="baseTableData"
                :header-cell-style="{ 'color': '#FFF','background-color': '#409EFF','text-align': 'center'}"
                :highlight-current-row="true"
                :max-height="1500"
                v-loading="loadingBase"
              >
                <el-table-column align="center" label="每日获取成长值上限" element-loading-text>
                  <template slot-scope="scope">
                    <span>{{ scope.row.growthDayMax || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  align="center"
                  fixed="right"
                  class-name="status-col"
                  label="所属商家/店铺"
                >
                  <template slot-scope="scope">
                    <span>{{ scope.row.deptName || '-'}}</span>
                  </template>
                </el-table-column>
              </el-table>
              <div class="toolbar t_r">
                <el-pagination
                  layout="total, prev, pager, next, jumper,sizes"
                  @current-change="baseCurrentChange"
                  :current-page="baseFilters.start"
                  :page-size="baseFilters.limit"
                  :total="baseTotalSize"
                  :page-sizes="[10, 20, 30, 40]"
                  @size-change="baseSizeChange"
                ></el-pagination>
              </div>
            </div>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="成长值规则列表" name="second">
          <el-form :inline="true" :model="growthFilters" :size="size" ref="growthFilters" >
            <!--基础设置顶部搜索条件栏-->
            <div class="toolbar search-input">
              <el-row >
              <el-form-item label="规则编号：">
                <el-input v-model.trim="growthFilters.growthNum" placeholder="输入规则编号" clearable maxlength="80"></el-input>
              </el-form-item>
              <el-form-item label="规则名称：">
                <el-input v-model.trim="growthFilters.ruleName" placeholder="输入规则名称" clearable maxlength="80"></el-input>
              </el-form-item>
              <el-form-item label="商家/店铺名称：">
                <el-input v-model.trim="growthFilters.msName" placeholder="输入商家/店铺名称" clearable maxlength="80"></el-input>
              </el-form-item>
              
                <el-form-item style="margin-bottom:0 !important">
                <el-form-item label="创建时间：" prop="startTime"  style="margin-right:0 !important">
                  <el-date-picker
                    v-model="growthFilters.startTime"
                    type="datetime"
                    placeholder="开始时间"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    clearable
                     @change="changeStartDate"
                    :picker-options="startDateDisabled"
                  ></el-date-picker>
                </el-form-item>
                <span class="line">-</span>
                <el-form-item prop="endTime">
                  <el-date-picker
                    v-model="growthFilters.endTime"
                    type="datetime"
                    placeholder="结束时间"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    clearable
                    @change="changeEndDate"
                    :picker-options="endDateDisabled"
                  ></el-date-picker>
                </el-form-item>
                </el-form-item>
              </el-row>
            </div>
            <!--基础设置顶部搜索条件按钮-->
            <div class="search-button-noborder">
              <el-form-item>
                <kt-button
                  icon="el-icon-search"
                  :label="'搜索'"
                  type="primary"
                  :size="size"
                  @click="findGrowthRule()"
                />
              </el-form-item>
              <el-form-item>
                <kt-button
                  :label="$t('action.reset')"
                  type="primary"
                  @click="resetForm('growthFilters')"
                  :size="size"
                  :plain="true"
                />
              </el-form-item>
            </div>
            <!--基础设置表格+分页器-->
            <div v-if="growthShow" class="w100">
              <!--表格-->
              <el-table
                :data="growthTableData"
                :header-cell-style="{ 'color': '#FFF','background-color': '#409EFF','text-align': 'center'}"
                :highlight-current-row="true"
                :max-height="1500"
                v-loading="loadingGrowth"
              >
                <el-table-column align="center" label="规则编号" element-loading-text>
                  <template slot-scope="scope">
                    <span>{{ scope.row.growthNum || '-'}}</span>
                  </template>
                </el-table-column>

                <el-table-column align="center" label="规则名称">
                  <template slot-scope="scope">
                    <span>{{ scope.row.ruleName || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="获取方式">
                  <template slot-scope="scope">
                    <span>{{ scope.row.ruleType || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="成长值">
                  <template slot-scope="scope">
                    <span>{{ scope.row.giveGrowthVal || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="所属商家/店铺">
                  <template slot-scope="scope">
                    <span>{{ scope.row.deptName || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="创建时间">
                  <template slot-scope="scope">
                    <span>{{ scope.row.createTime || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column class-name="status-col" align="center" fixed="right" label="状态">
                  <div slot-scope="scope">
                    <span v-if="scope.row.status == 0">启用</span>
                    <span v-if="scope.row.status == 1">停用</span>
                  </div>
                </el-table-column>
              </el-table>
              <!--分页栏v-if="scope.row.status == 1"-->
              <div class="toolbar t_r">
                <el-pagination
                  layout="total, prev, pager, next, jumper,sizes"
                  @current-change="growthCurrentChange"
                  :current-page="growthFilters.start"
                  :page-size="growthFilters.limit"
                  :total="growthTotalSize"
                  :page-sizes="[10, 20, 30, 40]"
                  @size-change="growthSizeChange"
                ></el-pagination>
              </div>
            </div>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="等级权益设置" name="third">
          <el-form :inline="true" :model="powerFilters" :size="size" ref="powerFilters" >
            <!--等级权益设置顶部搜索条件栏-->
            <div class="toolbar search-input">
              <el-row >
              <el-form-item label="商家/店铺名称：">
                <el-input
                  v-model="powerFilters.merchantOrStoreName"
                  placeholder="输入商家/店铺名称"
                  clearable
                  maxlength="80"
                ></el-input>
              </el-form-item>
              <el-form-item label="等级名称：" prop="levelName">
                <el-input v-model="powerFilters.levelName" placeholder="输入等级名称" maxlength="80" clearable></el-input>
              </el-form-item>
              <el-form-item   style="margin-bottom:0 !important">
                <el-form-item label="创建时间：" prop="startTime" style="margin-right:0 !important">
                  <el-date-picker
                    v-model="powerFilters.startTime"
                    type="datetime"
                    placeholder="开始时间"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    clearable
                    @change="changeStartDatePower"
                    :picker-options="startDateDisabledPower"
                  ></el-date-picker>
                </el-form-item>
                <span class="line">-</span>
                <el-form-item prop="endTime">
                  <el-date-picker
                    v-model="powerFilters.endTime"
                    type="datetime"
                    placeholder="结束时间"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    clearable
                    @change="changeEndDatePower"
                    :picker-options="endDateDisabledPower"
                  ></el-date-picker>
                </el-form-item>
                </el-form-item>
              </el-row>
            </div>
            <!--基础设置顶部搜索条件按钮-->
            <div class="search-button-noborder">
              <el-form-item>
                <kt-button
                  icon="el-icon-search"
                  :label="'搜索'"
                  type="primary"
                  :size="size"
                  @click="queryPowerRuleClick(null)"
                />
              </el-form-item>
              <el-form-item>
                <kt-button
                  :label="$t('action.reset')"
                  type="primary"
                  @click="resetFormPower('powerFilters')"
                  :size="size"
                  :plain="true"
                />
              </el-form-item>
            </div>
            <!--基础设置表格+分页器-->
            <div v-if="powerShow" class="w100">
              <!--表格-->
              <el-table
                :data="powerTableData"
                :header-cell-style="{ 'color': '#FFF','background-color': '#409EFF','text-align': 'center'}"
                :highlight-current-row="true"
                :max-height="1500"
                :size="'mini'"
                v-loading="loading"
              >
                <el-table-column align="center" label="ID" element-loading-text>
                  <template slot-scope="scope">
                    <span>{{ scope.row.id || '-'}}</span>
                  </template>
                </el-table-column>

                <el-table-column align="center" label="等级名称">
                  <template slot-scope="scope">
                    <span>{{ scope.row.levelName || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="所属商家/店铺">
                  <template slot-scope="scope">
                    <span>{{ scope.row.merchantOrStoreName || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="所属层级">
                  <template slot-scope="scope">
                    <span v-if="scope.row.deptType == 0">母平台</span>
                    <span v-if="scope.row.deptType == 1">子平台</span>
                    <span v-if="scope.row.deptType == 2">商家</span>
                    <span v-if="scope.row.deptType == 3">店铺</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="权益数">
                  <template slot-scope="scope">
                    <span>{{ scope.row.roleTotal || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="创建时间">
                  <template slot-scope="scope">
                    <span>{{ scope.row.createTime || '-'}}</span>
                  </template>
                </el-table-column>
                <el-table-column class-name="status-col" align="center" fixed="right" label="操作">
                  <div slot-scope="scope">
                    <div>
                      <kt-button
                        type="text"
                        size="mini"
                        style
                        @click="handleConfiguration(scope.row)"
                        label="查看权益"
                      ></kt-button>
                    </div>
                  </div>
                </el-table-column>
              </el-table>
              <div class="toolbar t_r">
                <el-pagination
                  layout="total, prev, pager, next, jumper,sizes"
                  @current-change="powerCurrentChange"
                  :current-page="powerFilters.start"
                  :page-size="powerFilters.limit"
                  :total="powerTotalSize"
                  :page-sizes="[10, 20, 30, 40]"
                  @size-change="powerSizeChange"
                ></el-pagination>
              </div>
            </div>
          </el-form>
          <!--配置权益-->
          <el-dialog
            title="配置权益"
            :visible.sync="rulePowerVisible"
            :close-on-click-modal="false"
            @closed="handleClose"
          >
            <el-form ref="rulePowerForm" label-width="80px" :model="rulePowerForm">
              <el-row>
                <el-col :span="6">
                  <el-form-item label="等级名称:">{{rulePowerForm.levelName}}</el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="所属平台:">{{rulePowerForm.deptName}}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-form-item label="等级权益:">
                  <template>
                    <el-table :data="tableDataRule">
                      <el-table-column
                        prop="legalRuleName"
                        :label="vipLabel"
                        width="300"
                        size="mini"
                      ></el-table-column>
                    </el-table>
                  </template>
                </el-form-item>
              </el-row>
              <div style="text-align:center">
                <el-button
                  :size="size"
                  @click.native="rulePowerVisible = false"
                >{{ $t("action.cancel") }}</el-button>
              </div>
            </el-form>
          </el-dialog>
        </el-tab-pane>
      </el-tabs>
    </div>
    <!-- 查看成长值规则弹框 -->
    <el-dialog
      :title="addOperate?'编辑成长值规则':'查看成长值规则'"
      :visible.sync="editDialogVisible"
      :close-on-click-modal="false"
      class="el-dialog-style"
    >
      <el-form ref="growthRuleForm" :model="growthRuleForm">
        <el-form-item label="所属层级：" prop="deptType" class="mb30">
          <el-input v-model="deptLevel" maxlength="20" :size="size" :disabled="editDis"></el-input>
        </el-form-item>
        <el-form-item label="所属组织：" prop="deptName" class="mb30">
          <el-input v-model="deptName" maxlength="20" :size="size" :disabled="editDis"></el-input>
        </el-form-item>
        <el-form-item label="获取方式：" prop="obtainMode" class="mb30">
          <el-input
            v-model="growthRuleForm.ruleType"
            maxlength="20"
            :size="size"
            placeholder="输入规则名称"
            :disabled="detailDis"
          ></el-input>
        </el-form-item>
        <el-form-item label="规则名称：" prop="ruleName">
          <el-input
            v-model="growthRuleForm.ruleName"
            maxlength="20"
            :size="size"
            placeholder="输入规则名称"
            :disabled="detailDis"
          ></el-input>
        </el-form-item>
      </el-form>
      <el-form ref="growthRuleForm" label-width="80px" :model="growthRuleForm">
        <el-row v-if="registered">
          <el-row class="mb30 mt20">
            <span class="font">注册赠送</span>
          </el-row>
          <el-form-item label="新用户注册发放：" label-width="140px" prop="giveGrowthVal">
            <el-input
              placeholder="输入数字"
              v-model.trim="growthRuleForm.giveGrowthVal"
              class="newUserRegister"
              @input="checkRegisteredVal($event)"
              oninput="value=value.replace(/[^\d]/g,'')"
              maxlength="5"
              :disabled="detailDis"
            ></el-input>成长值
          </el-form-item>
        </el-row>
        <el-row v-if="order">
          <el-form>
            <el-radio-group v-model="orderRadio">
              <el-form-item required>
                <el-row class="mb30 mt20">
                  <span class="font">下单赠送</span>
                </el-row>
                <el-row class="mb30 mt20">
                  <el-radio label="3" :disabled="radioDis">每消费赠送</el-radio>
                </el-row>
                <el-form-item
                  class="everyCostHandleSel mb30"
                  v-if="this.orderRadio == 3"
                  prop="consumeMoney"
                >
                  <span>每消费</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.consumeMoney"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>元，赠送</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.giveGrowthVal"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>
              <el-form-item required>
                <el-row class="mb30">
                  <el-radio label="6" :disabled="radioDis">阶梯消费赠送</el-radio>
                </el-row>
                <el-form-item
                  class="everyCostHandleSel"
                  v-if="this.orderRadio == 6"
                  prop="orderHandleSel"
                >
                  <div
                    v-for="(item,index) in growthRuleForm.orderHandleSel"
                    :key="index"
                    class="mb30"
                  >
                    <span class="textAlignment">消费</span>
                    <el-input
                      placeholder="输入数字"
                      v-model="growthRuleForm.orderHandleSel[index].consumeMoney"
                      @input="updateVal()"
                      oninput="value=value.replace(/[^\d]/g,'')"
                      maxlength="5"
                      :disabled="detailDis"
                      class="numberInput"
                    ></el-input>
                    <span>元，赠送</span>
                    <el-input
                      placeholder="输入数字"
                      v-model="growthRuleForm.orderHandleSel[index].giveGrowthVal"
                      @input="updateVal()"
                      oninput="value=value.replace(/[^\d]/g,'')"
                      maxlength="5"
                      :disabled="detailDis"
                      class="numberInput"
                    ></el-input>
                    <span>成长值</span>
                    <el-button
                      :size="size"
                      type="text"
                      @click="addOrderHandleSel(index)"
                      v-if="index==0"
                      @input="updateVal()"
                      :disabled="detailDis"
                      class="btnText_blue"
                    >添加</el-button>
                    <el-button
                      :size="size"
                      type="text"
                      @click="celarOrderHandleSel(index)"
                      v-if="index != 0"
                      :disabled="detailDis"
                      class="btnText_red"
                    >删除</el-button>
                  </div>
                </el-form-item>
              </el-form-item>
            </el-radio-group>

            <el-form-item required>
              <el-form-item class="everyCostHandleSel" prop="giveGrowthMaxNum">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  :disabled="detailDis"
                  class="numberInput"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row v-if="appraisal">
          <el-form>
            <el-checkbox-group v-model="whetherPicList">
              <el-form-item required>
                <el-row class="mb30 mt20">
                  <span class="font">评价赠送</span>
                </el-row>
                <el-row class="mb30">
                  <el-checkbox label="带图" :disabled="radioDis"></el-checkbox>
                </el-row>

                <el-form-item class="everyCostHandleSel mb30" prop="appGiveGrowthVal">
                  <span>完成评价，赠送</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.appGiveGrowthVal"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>
              <el-form-item required>
                <el-form-item class="everyCostHandleSel mb30" prop="appGiveGrowthMaxNum">
                  <span>每日上限</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.appGiveGrowthMaxNum"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>

              <el-form-item required>
                <el-row class="mb30">
                  <el-checkbox label="不带图" :disabled="radioDis"></el-checkbox>
                </el-row>
                <el-form-item class="everyCostHandleSel mb30" prop="appGiveGrowthVals">
                  <span>完成评价，赠送</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.appGiveGrowthVals"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>
              <el-form-item required>
                <el-form-item class="everyCostHandleSel" prop="appGiveGrowthMaxNums">
                  <span>每日上限</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.appGiveGrowthMaxNums"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>
            </el-checkbox-group>
          </el-form>
        </el-row>
        <el-row v-if="cost">
          <el-form>
            <el-radio-group v-model="costRadio">
              <el-form-item required>
                <el-row class="mb30 mt20">
                  <span class="font">充值赠送</span>
                </el-row>
                <el-row>
                  <el-row class="mb30 mt20">
                    <el-radio label="3" :disabled="radioDis">每充值赠送</el-radio>
                  </el-row>
                </el-row>
                <el-form-item class="everyCostHandleSel mb30" v-if="this.costRadio == 3">
                  <span>每充值</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.consumeMoney "
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>元，赠送</span>
                  <el-input
                    placeholder="输入数字"
                    v-model="growthRuleForm.giveGrowthVal"
                    @input="updateVal()"
                    oninput="value=value.replace(/[^\d]/g,'')"
                    maxlength="5"
                    :disabled="detailDis"
                  ></el-input>
                  <span>成长值</span>
                </el-form-item>
              </el-form-item>
              <el-form-item required>
                <el-row>
                  <el-row class="mb30">
                    <el-radio label="6" :disabled="radioDis">阶梯充值赠送</el-radio>
                  </el-row>
                </el-row>
                <el-form-item class="everyCostHandleSel" v-if="this.costRadio == 6">
                  <div
                    v-for="(item,index) in growthRuleForm.costHandleSel"
                    :key="index"
                    class="mb30"
                  >
                    <span>充值</span>
                    <el-input
                      placeholder="输入数字"
                      v-model="item.consumeMoney"
                      @input="updateVal()"
                      oninput="value=value.replace(/[^\d]/g,'')"
                      maxlength="5"
                      :disabled="detailDis"
                    ></el-input>
                    <span>元，赠送</span>
                    <el-input
                      placeholder="输入数字"
                      v-model="item.giveGrowthVal"
                      @input="updateVal()"
                      oninput="value=value.replace(/[^\d]/g,'')"
                      maxlength="5"
                      :disabled="detailDis"
                    ></el-input>
                    <span>成长值</span>
                    <el-button
                      :size="size"
                      type="primary"
                      @click="addCostHandleSel(index)"
                      v-show="index==0"
                      style="margin-left: 8px;"
                      :disabled="detailDis"
                    >添加</el-button>
                    <el-button
                      :size="size"
                      type="danger"
                      @click="celarCostHandleSel(index)"
                      v-if="index != 0"
                      :disabled="detailDis"
                    >删除</el-button>
                  </div>
                </el-form-item>
              </el-form-item>
            </el-radio-group>

            <el-form-item required>
              <el-form-item class="everyCostHandleSel" prop="giveGrowthMaxNum">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row v-if="share">
          <el-form>
            <el-form-item required>
              <el-row class="mb30 mt20">
                <span class="font">分享赠送</span>
              </el-row>
              <el-form-item class="everyCostHandleSel mb30">
                <span>完成分享，赠送</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthVal"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
            <el-form-item required>
              <el-form-item class="everyCostHandleSel">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row v-if="goodsLike">
          <el-form>
            <el-form-item required>
              <el-row class="mt20 mb30">
                <span class="font">点赞赠送</span>
              </el-row>
              <el-form-item class="everyCostHandleSel mb30">
                <span>完成点赞，赠送</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthVal"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
            <el-form-item required>
              <el-form-item class="everyCostHandleSel">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row v-if="shareOrder">
          <el-form>
            <el-form-item required>
              <el-row class="mt20 mb30">
                <span class="font">晒单赠送</span>
              </el-row>
              <el-form-item class="everyCostHandleSel mb30">
                <span>完成晒单，赠送</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthVal"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
            <el-form-item required>
              <el-form-item class="everyCostHandleSel">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row v-if="collect">
          <el-form>
            <el-form-item required>
              <span class="font">收藏赠送</span>
              <el-form-item class="everyCostHandleSel">
                <span>完成收藏，赠送</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthVal"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
            <el-form-item required>
              <el-form-item class="everyCostHandleSel">
                <span>每日上限</span>
                <el-input
                  placeholder="输入数字"
                  v-model="growthRuleForm.giveGrowthMaxNum"
                  @input="updateVal()"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxlength="5"
                  :disabled="detailDis"
                ></el-input>
                <span>成长值</span>
              </el-form-item>
            </el-form-item>
          </el-form>
        </el-row>
      </el-form>
      <div style="text-align:center;padding-top: 30px;">
        <el-button
          :size="size"
          type="primary"
          @click="nextStepRuleGrowth(2)"
          :loading="editLoading"
          v-show="detailShow"
          :disabled="detailDis"
        >保存</el-button>
        <el-button
          :size="size"
          type="primary"
          @click="returnEditList('growthRuleForm')"
          :disabled="detailDis"
        >取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import KtButton from "@/views/Core/KtButton";
import { formatDate } from "@/utils/datetime";
import { formatDate2 } from "@/utils/datetime";
export default {
  components: {
    KtButton
  },
  data() {
    return {
      startDateDisabled: {},//开始时间限制
      endDateDisabled: {},//结束时间限制
      startDateDisabledPower: {},//开始时间限制
      endDateDisabledPower: {},//结束时间限制
      loadingBase:false,
      loadingGrowth:false,
      loading:false,
      childDis: false,
      radioDis: true,
      vipLabel: "",
      tableDataRule: [],
      rulePowerVisible: false,
      detailDis: false,
      detailShow: false,
      editLoading: false,
      obtainMode: null,
      /* 所属组织层级 编辑,查看弹窗*/
      deptLevel: "母平台",
      /* 所属组织名称 编辑,查看弹窗 */
      deptName: null,
      // 搜索表单对应的数据对象
      obtainModeList: [
        {
          id: 1,
          obtainMode: "下单赠送"
        },
        {
          id: 2,
          obtainMode: "注册赠送"
        },
        {
          id: 3,
          obtainMode: "评价赠送"
        },
        {
          id: 4,
          obtainMode: "充值赠送"
        },
        {
          id: 5,
          obtainMode: "分享赠送"
        },
        {
          id: 6,
          obtainMode: "点赞赠送"
        },
        {
          id: 7,
          obtainMode: "晒单赠送"
        },
        {
          id: 8,
          obtainMode: "收藏赠送"
        }
      ],
      registered: false, //注册赠送
      order: false, //下单赠送
      appraisal: false, //评价赠送
      cost: false, //充值赠送
      share: false, //分享赠送
      goodsLike: false, //点赞赠送
      shareOrder: false, //晒单赠送
      collect: false, //收藏赠送
      /* 成长值规则form */
      growthRuleForm: {
        id: null,
        status: null,
        ruleNum: null,
        ruleName: null,
        deptId: null,
        ruleType: null,
        obtainMode: null,
        consumeMode: null,
        orderHandleSel: [{ consumeMoney: "", giveGrowthVal: "" }], //阶梯消费x元赠送y成长值
        costHandleSel: [{ consumeMoney: "", giveGrowthVal: "" }], //阶梯充值X元赠送Y成长值
        appGiveGrowthVal: null,
        appGiveGrowthVals: null,
        appGiveGrowthMaxNum: null,
        appGiveGrowthMaxNums: null,
        giveGrowthVal: null,
        giveGrowthMaxNum: null,
        consumeMoney: null
      },
      rulePowerForm: {
        id: "",
        deptId: "",
        deptName: "",
        vipName: "",
        ruleIds: []
      },
      editOperate: null, //编辑
      addOperate: null, //添加
      editDialogVisible: false,
      /* 控制获取方式是否可操作 */
      editDis: false,
      /* 控制充值赠送radio框 */
      costRadio: "3",
      /* 控制评价赠送check框 */
      whetherPicList: ["带图"],
      /* 控制下单赠送radio框 */
      orderRadio: "3",
      ruleType: 1, //等级类型 依据等级类型匹配不同的列表
      baseShow: true, //基础列表是否显示
      growthShow: false, //成长值规则列表是否显示
      powerShow: false, // 等级权益列表是否展示
      deptOption: [], //所属平台
      activeName: "first",
      baseFilters: {
        childId: null,
        msName: null,
        start: 1,
        limit: 10
      }, //基础查询filters框
      growthFilters: {
        startTime: null,
        endTime: null,
        ruleNum: null,
        ruleName: null,
        childId: null,
        msName: null,
        start: 1,
        limit: 10
      }, //成长值查询filters框
      powerFilters: {
        startTime: "",
        endTime: "",
        childId: "",
        msName: "",
        levelName: "",
        start: 1,
        limit: 10
      }, //权益查询filters框
      size: "mini",
      baseTotalSize: 0,
      baseTableData: [],
      growthTotalSize: 0,
      growthTableData: [],
      powerTotalSize: 0,
      powerTableData: [],
      params: {} //请求参数
    };
  },
  methods: {
    changeStartDate: function() {
      var this_ = this;
      this_.endDateDisabled = {
        disabledDate: time => {
          if (this_.growthFilters.startTime) {
            return time.getTime() <= new Date(this_.growthFilters.startTime).getTime();
          }
        }
      };
    },
    changeEndDate: function() {
      var this_ = this;
      this_.startDateDisabled = {
        disabledDate: time => {
          if (this_.growthFilters.endTime) {
            return time.getTime() >= new Date(this_.growthFilters.endTime).getTime();
          }
        }
      };
    },
    changeStartDatePower: function() {
      var this_ = this;
      this_.endDateDisabledPower = {
        disabledDate: time => {
          if (this_.powerFilters.startTime) {
            return time.getTime() <= new Date(this_.powerFilters.startTime).getTime();
          }
        }
      };
    },
    changeEndDatePower: function() {
      var this_ = this;
      this_.startDateDisabledPower = {
        disabledDate: time => {
          if (this_.powerFilters.endTime) {
            return time.getTime() >= new Date(this_.powerFilters.endTime).getTime();
          }
        }
      };
    },
    resetFormPower(formName) {
       //需要校验的key
      let keys = ["startTime","endTime","childId","msName","levelName","merchantOrStoreName"]
      let boo = this.seachTableUtils.checkFromIsNull(this.powerFilters,keys)
      if(!boo){
        return
      }
      (this.powerFilters = {
        startTime: "",
        endTime: "",
        childId: "",
        msName: "",
        levelName: "",
        merchantOrStoreName:'',
        start: 1,
        limit: 10
      }),
        this.$refs[formName].resetFields();
       this.queryPowerRule();
    },
    //配置权限弹框
    handleConfiguration(data) {
      this.$router.push({
        path: "/PowerLookVipTemplate",
        query: { id: data.id, type: 1 }
      });
    },
    //tab切换按钮
    handleClick(row) {
      let this_ = this;
      if (row.name == "first") {
        this_.baseShow = true;
        this_.growthShow = false;
        this_.powerShow = false;
        this_.params = this_.baseFilters;
        this_.params.ruleType = this.ruleType;
        this_.queryBaseRule();
      } else if (row.name == "second") {
        this_.baseShow = false;
        this_.growthShow = true;
        this_.powerShow = false;
        this_.params = this_.growthFilters;
        this_.params.ruleType = this_.ruleType;
        this_.queryGrowthRule();
      } else if (row.name == "third") {
        this.baseShow = false;
        this.growthShow = false;
        this.powerShow = true;
        this_.params = this_.powerFilters;
        this_.params.ruleType = this_.ruleType;
        this_.queryPowerRule();
      }

    },
    //查询基础列表
    queryBaseRule() {
      let this_ = this;
      this.loadingBase=true;
      this_.params = this_.baseFilters;
      this_.utils.request.queryBaseRule(this_.params, function(res) {
        if (res.code == "0000") {
          this_.baseTableData = res.data.rows;
          this_.baseTotalSize = res.data.total;
          this_.loadingBase=false;
        }
      });
    },
     //点击搜索，页码重置
    queryPowerRuleClick(){
      this.powerFilters.start = 1;
      this.queryPowerRule();
    },
    //查询权益列表
    queryPowerRule() {
      let this_ = this;
      this.loading=true;
      this_.params = this_.powerFilters;
      this_.utils.request.queryPowerRule(this_.params, function(res) {
        if (res.code == "0000") {
          this_.powerTableData = res.data.rows;
          this_.powerTotalSize = res.data.total;
          this_.loading=false;
        }
      });
    },
    //查询成长值列表
    queryGrowthRule() {
      let this_ = this;
      this.loadingGrowth=true;
      this_.params = this_.growthFilters;
      this_.utils.request.queryGrowthRule(this_.params, function(res) {
        if (res.code == "0000") {
          this_.growthTableData = res.data.rows;
          this_.growthTotalSize = res.data.total;
          this_.loadingGrowth=false;
        }
      });
    },
    //获取子平台列表
    queryDeptOption() {
      let query = {};
      let this_ = this;
      query.deptType = 1;
      this_.utils.request.queryDeptList(query, function(res) {
        if (res.code == "0000") {
          this_.deptOption = res.data;
        }
      });
    },
    // 基础设置分页
    baseCurrentChange(start) {
      this.baseFilters.start = start;
    },
    baseSizeChange(limit) {
      this.baseFilters.start = 1;
      this.baseFilters.limit = limit;
    },
    handleClose(data) {
      (this.rulePowerForm = {
        id: "",
        deptName: "",
        ruleIds: []
      }),
        (this.tableDataRule = []);
      this.$refs.rulePowerForm.resetFields();
    },

    // 成长值列表分页
    growthCurrentChange(start) {
      this.growthFilters.start = start;
      this.queryGrowthRule();
    },
    growthSizeChange(limit) {
      this.growthFilters.start = 1;
      this.growthFilters.limit = limit;
      this.queryGrowthRule();
    },

    //等级权益列表分页
    powerCurrentChange(start) {
      this.powerFilters.start = start;
      this.queryPowerRule();
    },
    powerSizeChange(limit) {
      this.powerFilters.start = 1;
      this.powerFilters.limit = limit;
      this.queryPowerRule();
    },
    //查看成长值规则弹窗
    growthRuleDetail(row) {
      let this_ = this;
      this_.growthRuleForm.deptName = row.deptName;
      this_.growthRuleForm.id = row.id;
      this_.growthRuleForm.ruleType = row.ruleType;
      // this.growthDialogVisible = true;
      this_.editDialogVisible = true;
      this.editDis = true;
      this.detailDis = true;
      this.selectModel(row.obtainMode);
      let params = {};
      params.id = row.id;
      params.whetherPic = row.whetherPic;
      this_.growthRuleForm.obtainMode = parseInt(row.obtainMode);
      this_.growthRuleForm.ruleName = row.ruleName;

      params.obtainMode = row.obtainMode;
      if (row.obtainMode != 1 && row.obtainMode != 4 && row.obtainMode != 3) {
        this_.utils.request.growthActionRule(params, function(res) {
          this_.deptName = res.deptName;
          this_.deptType = res.deptType;
          if (this_.deptType == 0) {
            this_.deptLevel = "母平台";
          } else if (this_.deptType == 1) {
            this_.deptLevel = "子平台";
          } else if (this_.deptType == 2) {
            this_.deptLevel = "商家";
          } else if (this_.deptType == 3) {
            this_.deptLevel = "店铺";
          }
          //调取后台查询业务规则信息
          this_.growthRuleForm.giveGrowthVal = res.giveGrowthVal;
          if (res.giveGrowthMaxNum == 0) {
            this_.growthRuleForm.giveGrowthMaxNum = "";
          } else {
            this_.growthRuleForm.giveGrowthMaxNum = res.giveGrowthMaxNum;
          }
        });
      } else if (row.obtainMode == 1 || row.obtainMode == 4) {
        //如果是下单或充值
        this_.utils.request.getRrowthOrderRuleById(params, function(res) {
          this_.deptName = res.data.deptName;
          this_.deptType = res.data.deptType;
          if (this_.deptType == 0) {
            this_.deptLevel = "母平台";
          } else if (this_.deptType == 1) {
            this_.deptLevel = "子平台";
          } else if (this_.deptType == 2) {
            this_.deptLevel = "商家";
          } else if (this_.deptType == 3) {
            this_.deptLevel = "店铺";
          }
          if (res.data.giveGrowthMaxNum != 0) {
            this_.growthRuleForm.giveGrowthMaxNum = res.data.giveGrowthMaxNum;
          } else {
            this_.growthRuleForm.giveGrowthMaxNum = null;
          }
          if (res.data.obtainMode == 1) {
            //如果是下单赠送
            if (res.data.consumeType == 3) {
              this_.orderRadio = res.data.consumeType + "";
              this_.growthRuleForm.consumeMoney = res.data.consumeMoney;
              this_.growthRuleForm.giveGrowthVal = res.data.giveGrowthVal;
            } else {
              this_.orderRadio = res.data.orderHandleSel[0].consumeType + "";
              this_.growthRuleForm.orderHandleSel = [];
              res.data.orderHandleSel.forEach(element => {
                let obj = {};
                (obj.consumeMoney = element.consumeMoney),
                  (obj.giveGrowthVal = element.giveGrowthVal);

                this_.growthRuleForm.orderHandleSel.push(obj);
              });
            }
          } else if (res.data.obtainMode == 4) {
            //如果是充值赠送
            if (res.data.costType == 3) {
              this_.costRadio = res.data.costType + "";
              this_.growthRuleForm.consumeMoney = res.data.consumeMoney;
              this_.growthRuleForm.giveGrowthVal = res.data.giveGrowthVal;
            } else {
              this_.costRadio = res.data.costHandleSel[0].costType + "";
              this_.growthRuleForm.costHandleSel = [];
              res.data.costHandleSel.forEach(element => {
                let obj = {};
                (obj.consumeMoney = element.consumeMoney),
                  (obj.giveGrowthVal = element.giveGrowthVal);
                this_.growthRuleForm.costHandleSel.push(obj);
              });
            }
          }
        });
      } else if (row.obtainMode == 3) {
        //如果是评价赠送
        this_.utils.request.getRrowthOrderRuleById(params, function(res) {
          this_.deptName = res.data.deptName;
          this_.deptType = res.data.deptType;
          if (this_.deptType == 0) {
            this_.deptLevel = "母平台";
          } else if (this_.deptType == 1) {
            this_.deptLevel = "子平台";
          } else if (this_.deptType == 2) {
            this_.deptLevel = "商家";
          } else if (this_.deptType == 3) {
            this_.deptLevel = "店铺";
          }
          if (res.data.whetherPic == 3) {
            this_.$set(this_.whetherPicList, 0, "带图");
            this_.$set(this_.whetherPicList, 1, "不带图");
            this_.growthRuleForm.appGiveGrowthVal = res.data.appGiveGrowthVal;
            if (res.data.appGiveGrowthMaxNum != 0) {
              this_.growthRuleForm.appGiveGrowthMaxNum =
                res.data.appGiveGrowthMaxNum;
            } else {
              this_.growthRuleForm.appGiveGrowthMaxNum = "";
            }
            this_.growthRuleForm.appGiveGrowthVals = res.data.appGiveGrowthVals;
            if (res.data.appGiveGrowthMaxNums != 0) {
              this_.growthRuleForm.appGiveGrowthMaxNums =
                res.data.appGiveGrowthMaxNums;
            } else {
              this_.growthRuleForm.appGiveGrowthMaxNums = "";
            }
          } else if (res.data.whetherPic == 1) {
            this_.$set(this_.whetherPicList, 0, "带图");
            this_.growthRuleForm.appGiveGrowthVal = res.data.giveGrowthVal;
            if (res.data.appGiveGrowthMaxNum != 0) {
              this_.growthRuleForm.appGiveGrowthMaxNum =
                res.data.appGiveGrowthMaxNum;
            } else {
              this_.growthRuleForm.appGiveGrowthMaxNum = "";
            }
          } else if (res.data.whetherPic == 2) {
            this_.$set(this_.whetherPicList, 1, "不带图");
            this_.growthRuleForm.appGiveGrowthVals = res.data.giveGrowthVal;
            if (res.data.appGiveGrowthMaxNums != 0) {
              this_.growthRuleForm.appGiveGrowthMaxNums =
                res.data.appGiveGrowthMaxNums;
            } else {
              this_.growthRuleForm.appGiveGrowthMaxNums = "";
            }
          }
        });
      }

    },
    //下拉选则获取方式
    selectModel(id) {
      let this_ = this;
      let obj = {};
      let selectModel = {};
      obj = this_.obtainModeList.find(item => {
        //model就是上面的数据源
        if (item.id == id) {
          this_.selectModel.obtainMode = id;
          this_.selectModel.ruleName = item.ruleName;
          if (item.id == 1) {
            this_.order = true;
            this_.registered = false;
            this_.appraisal = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 2) {
            this_.order = false;
            this_.registered = true;
            this_.appraisal = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 3) {
            this_.appraisal = true;
            this_.order = false;
            this_.registered = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 4) {
            this_.appraisal = false;
            this_.order = false;
            this_.registered = false;
            this_.cost = true;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 5) {
            this_.appraisal = false;
            this_.order = false;
            this_.registered = false;
            this_.cost = false;
            this_.share = true;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 6) {
            this_.appraisal = false;
            this_.order = false;
            this_.registered = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = true;
            this_.shareOrder = false;
            this_.collect = false;
          } else if (item.id == 7) {
            this_.appraisal = false;
            this_.order = false;
            this_.registered = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = true;
            this_.collect = false;
          } else if (item.id == 8) {
            this_.appraisal = false;
            this_.order = false;
            this_.registered = false;
            this_.cost = false;
            this_.share = false;
            this_.goodsLike = false;
            this_.shareOrder = false;
            this_.collect = true;
          }
        }
      });
    },
    //基础设置查询按钮
    findBasePage() {
      this.baseFilters.start=1;
      this.queryBaseRule();
    },
    //重置按钮
    resetForm(formName) {
      let this_ = this;
      if (this_.$refs[formName] != undefined) {
        if (formName == "baseFilters") {
          //需要校验的key
          let keys = ["msName", "childId"];
          let boo = this_.seachTableUtils.checkFromIsNull(
            this_.baseFilters,
            keys
          );
          if (!boo) {
            return;
          }
          this_.baseFilters.msName = null;
          this_.baseFilters.childId = null;
          this_.utils.request.queryBaseRule(this_.baseFilters, function(res) {
            if (res.code == "0000") {
              this_.baseTableData = res.data.rows;
              this_.baseTotalSize = res.data.total;
            }
          });
        } else if (formName == "growthFilters") {
          //需要校验的key
          let keys = [
            "msName",
            "childId",
            "startTime",
            "endTime",
            "growthNum",
            "openEndTime",
            "ruleName",
            "ruleName",
          ];
          let boo = this_.seachTableUtils.checkFromIsNull(this_.growthFilters, keys);
          if (!boo) {
            return;
          }
          this_.growthFilters.msName = null;
          this_.growthFilters.childId = null;
          this_.growthFilters.startTime = null;
          this_.growthFilters.endTime = null;
          this_.growthFilters.growthNum = null;
          this_.growthFilters.ruleName = null;
          this_.utils.request.queryGrowthRule(this_.growthFilters, function(
            res
          ) {
            if (res.code == "0000") {
              this_.growthTableData = res.data.rows;
              this_.growthTotalSize = res.data.total;
            }
          });
        }
      }
    },
    findGrowthRule() {
      this.growthFilters.start=1;
      this.queryGrowthRule();
    },
    //查询当前登录账号所属层级
    getDeptType() {
      let this_ = this;
      this.utils.request.getDeptType({}, function(res) {
        if (res.deptType == 0) {
          this_.childDis = false;
        } else {
          this_.childDis = true;
        }
      });
    }
  },
  mounted() {
    this.queryDeptOption();
    this.queryBaseRule();
    this.getDeptType();
  }
};
</script>
<style scoped lang="scss">
.type {
  display: flex;
  align-items: center;
}
.type p {
  text-align: right;
  margin-right: 20px;
  width: 120px;
}
.newUserRegister {
  width: 20%;
  margin-left: 2%;
}
.newUserOrder {
  margin-top: 2%;
  width: 20%;
  margin-left: 2%;
}
.font {
  font-size: 18px;
  font-weight: 800;
}
.ruleDes {
  color: #ffdead;
  font-size: 20px;
}
.positionDes {
  text-align: center;
  margin-top: 2%;
}
.ruleClass {
  font-size: 30px;
}
.everyCostHandleSel {
  /deep/ .el-input {
    width: 20%;
  }
}
.btnText_blue {
  color: #409eff;
}
.btnText_red {
  color: #f67373;
}
/deep/ .numberInput {
  width: 100px !important;
  /deep/ .el-input__inner {
    width: 100px;
  }
}
.el-dialog-style {
  /deep/ .el-dialog {
    width: 610px;
  }
}
.textAlignment {
  display: inline-block;
  width: 56px;
  text-align: right;
}
.turnInlineBlock {
  display: inline-block !important;
}
.search-inputs {
  .el-form-item {
    margin-right: 0;
    margin-bottom: 30px;
  }
  .times {
    .times-to {
      padding: 0 10px;
      height: 32px;
      line-height: 32px;
      color: #999;
      display: inline-block;
    }
    /deep/ .el-input {
      width: 200px !important;
      /deep/ .el-input__inner {
        width: 100% !important;
      }
    }
  }

  // 搜索输入框标签
  /deep/ .el-form-item__label {
    text-align: right;
  }

  // 搜索输入框
  /deep/ .el-form-item__content {
    .el-input__inner {
      width: 178px;
      height: 36px;
      line-height: 36px;
    }

    .el-date-editor.el-input,
    .el-date-editor.el-input__inner {
      width: auto;
    }
  }
}
.search-input {
  .times {
    .times-to {
      padding: 0 10px;
      height: 32px;
      line-height: 32px;
      color: #999;
      display: inline-block;
    }
    /deep/ .el-input {
      width: auto !important;
      /deep/ .el-input__inner {
        width: auto !important;
      }
    }
  }
}

</style>
